import { user_login } from "../utils/api";
import React, { Component } from 'react';



class Login extends Component {
  state = {
    phone: '',
    pass: '',
  }
  handleChange(e) {
    this.setState({
      [e.target.name]: e.target.value
    })
  }
  login() {
    if (this.state.phone == '' && this.state.pass == '') {
      alert('请输入正确的手机号和密码！')
    } else {
      user_login(this.state).then((res) => {
        if (res.data.code == 200) {
          //保存token
          localStorage.setItem('token', res.data.token);
          //保存userinfo
          localStorage.setItem('userinfo', JSON.stringify(res.data.userinfo));
          this.props.history.push('/index/home') 
        }else{
          alert(res.data.msg)
        }

      })
    }
  }

  render() {
    return (
      <div className='login_register'>
        <div className="content-box">
          <div className="input-box">
            <input type="text" name="phone" value={this.state.phone} onChange={(e) => { this.handleChange(e) }} placeholder="请输入用户名" />
          </div>
          <div className="input-box">
            <input type="password" name="pass" value={this.state.pass} onChange={(e) => { this.handleChange(e) }} placeholder="请输入密码" />
          </div>
          <div className="button_1 span-box" onClick={() => { this.login() }}>
            <span>登录</span>
          </div>
          <div className="button_2 span-box">
            <span>注册</span>
          </div>
        </div>
      </div>
    );
  }
}
export default Login;